<template>
    <div>
        <h1 style="font-size:2rem">欢迎来到 第五届ACM程序设计大赛</h1>
        <div style="font-size:1rem">欢迎参加。</div>
        <Tooltip content="3 done / 3 in progress / 4 to do" style="width: 100%">
            <Progress :percent="60" :success-percent="30"/>
        </Tooltip>
        <H4>比赛时间：2019-01-09 11:00:00 ~ 2019-01-09 11:00:00</H4>
        <br>
        <ButtonGroup>
            <Button @click="$router.push({name:'ContestRank'})">排名</Button>
            <Button>状态</Button>
        </ButtonGroup>
        <br>
        <br>
        <Card>
            <H3 slot="title">比赛须知</H3>1.参赛队伍最多由三名参赛队员组成。
            <br>2.竞赛中命题10题左右，试题描述为英文，比赛时间为5个小时，前四个小时可以实时看到排名，最后一小时封榜，无法看到排名。
            <br>3.竞赛可以使用的语言：Java, C, C++, Kotlin 和 Python。
            <br>4.重点考察选手的算法和程序设计能力，不考察实际工程中常用的系统编程，多线程编程等等；
            <br>5.选手可携带任何非电子类资料，包括书籍和打印出来的程序等，部分赛区会对选手携带的纸质资料做限制。
            <br>6.评委负责将结果（正确或出错的类型）通过网络尽快返回给选手，除此之外不提供任何额外帮助；
            <br>7.每个题目对应一种颜色的气球，通过该题目的队伍会得到对应颜色气球。每道题目第一支解决掉它的队还会额外获得一个“FIRST PROBLEM SOLVED”的气球。
        </Card>
        <br>
        <TablePart :table="problemList"></TablePart>
    </div>
</template>

<script>
import TablePart from "./TablePart";
import {IViewTable} from "_i";
export default {
  name: "ContestCententPart",
  components: { TablePart },
  data() {
    return {
      problemList: new IViewTable(
        [
          {
            title: "编号",
            key: "0",
            width: 20
          },
          {
            title: "题目",
            key: "1",
            align: "left"
          },
          {
            title: "状态",
            key: "2",
            width: 20,
            type: "tag",
            colors: { "未提交": "default", "正确":"success","错误":"error" }
          }
        ],
        [
          {
            0: "A",
            1: "鸡兔同笼",
            2: "正确"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "错误"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          },
          {
            0: "A",
            1: "鸡兔同笼",
            2: "未提交"
          }
        ]
      )
    };
  }
};
</script>

<style lang="less" scoped>
</style>